<!DOCTYPE html>
<html lang="en">

<head>
    <!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap-grid.css" rel="stylesheet"> -->
    <link href="../vendor/bootstrap-grid.css" rel="stylesheet">
    <meta charset="utf-8" />
    <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/favicon.ico">
    <link rel="icon" type="image/png" href="../assets/img/favicon.ico">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no'
        name='viewport' />



    <!-- Font Awesome Icons -->
    <!-- <link rel="stylesheet" href="#" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous"> -->
    <link rel="stylesheet" href="#" crossorigin="anonymous">

    <!-- Main CSS -->
    <link href="../assets/css/main.css" rel="stylesheet" />
	<link href="../assets/layui/css/layui.css" rel="stylesheet">
	<link href="../assets/layui/cascader/cascader.css" rel="stylesheet">
    <!-- Animation CSS -->
    <link href="../vendor/aos.css" rel="stylesheet" />
    <style>
        .col,
        .selControlItem,
        .selControl {
            /* display: flex;
            justify-content: space-between; */
        }

        .form-control {
            /* width: 82%; */
        }

        label {
            width: 17%;
            line-height: 38.8px;
        }

        #probation {
            padding: 0 30px;
        }

        .productDefin {
            width: 17%;
        }

        .selControl {
            width: 100%;
        }



        .definition {
            display: none;
        }

        .selShow {
            display: block !important;
        }
        .selRadio{
            width: 82%;
            line-height: 38.8px;
        }
        .selRadio span{
            padding-right: 30px;
        }
        input[type='radio']{
            margin-right: 10px;
        }
		.layui-form-label{
			width: 150px;
		}
		.selControlItem {
		    width: 82%;
		    padding-bottom: 15px;
		}

		.selControlItem span {
		    line-height: 38.8px;
		}

		.table tr:last-child {
		    border: none;
		}

		.table tr th {
		    background-color: #4476A7;
		    color: #fff;
		    font-weight: 400;
		    text-align: center;
		    position: relative;
		}

		.table tr th::after {
		    content: '';
		    width: 1px;
		    height: 12px;
		    position: absolute;
		    right: 0;
		    background-color: #fff;
		    top: 50%;
		    transform: translateY(-50%);
		}

		.table tr th:last-child::after {
		    content: '';
		    width: 0;
		    height: 0;
		    background-color: transparent;
		}

		.table tr td {
		    text-align: center;
		    border: 1px solid green;
		    border-top: 1px solid green;
		    vertical-align: baseline;
		    position: relative;
		}

		.table tr td select {
		    width: 80%;
		    outline: none;
		    border: none;
		    appearance: none;
		    -webkit-appearance: none;
		    -moz-appearance: none;
		}

		table tr td input {
		    outline: none;
		    border: none;
		    text-align: center;
		    width: 100%;
		}

		table tr td:last-child {
		    border: none;
		}
		/* 火狐样式 */
		@media screen and (min--moz-device-pixel-ratio:0) {
			#controlSet tr td>input,#priceSet tr td>input {
				margin-top: -30px;
				display: block;
			}
		}
		.layui-input-block .ruleChoose{
			position: absolute;
			top: 10px;
		}
		.layui-input-block .ruleChooseBtn{
			text-decoration:underline !important;
			cursor: pointer;
		}
		.layui-input-block .ruleChooseSelect{

		}
		.layui-input-block .ruleChooseTip{

		}
		.show{
			display: block;
		}
		.hide{
			display: none;
		}

    </style>
</head>

<body>


    <!-------------------------------------- PRICING --------------------------------------->
	<!-------------------------------------- PRICING --------------------------------------->
	<section class="pt-4 pb-5">
		<div class="col-md-12" id="probation">
			<form id="form1" class="layui-form" lay-filter="productRegisterForm">
				<div class="row form-group">
					<div class="col">
						<label class="layui-form-label">操作类型：</label>
						<div class="layui-input-block" style="margin-left: 150px;">
							<select class="form-control" name="generationMode" lay-filter="generationMode">
								<option value="1">共享管理</option>
								<option value="2" selected>存储管理</option>
								<option value="3">授权状态</option>
								<option value="4">水印状态</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item StorageLocation">
					<label class="layui-form-label">存储位置：</label>
					<div class="layui-input-block">
						<input type="radio" name="StorageLocation" value="0" lay-filter="StorageLocation" title="本平台" checked>
						<input type="radio" name="StorageLocation" value="1" lay-filter="StorageLocation" title="女娲云链">
					</div>
				</div>
				<div class="layui-form-item SharedManage hide">
					<label class="layui-form-label">共享管理：</label>
					<div class="layui-input-block">
						<input type="radio" name="SharedManage" value="0" lay-filter="SharedManage" title="不共享" checked>
						<input type="radio" name="SharedManage" value="1" lay-filter="SharedManage" title="本平台">
						<input type="radio" name="SharedManage" value="2" lay-filter="SharedManage" title="多平台共享">
					</div>
				</div>
				<div class="layui-form-item IsAuthorization hide">
					<label class="layui-form-label">是否需要授权：</label>
					<div class="layui-input-block">
						<input type="radio" name="IsAuthorization" value="0" lay-filter="IsAuthorization" title="未开启" checked>
						<input type="radio" name="IsAuthorization" value="1" lay-filter="IsAuthorization" title="开启">
					</div>
				</div>
				<div class="layui-form-item IsWatermark hide">
					<label class="layui-form-label">是否添加水印：</label>
					<div class="layui-input-block">
						<input type="radio" name="IsWatermark" value="0" lay-filter="IsWatermark" title="未开启" checked>
						<input type="radio" name="IsWatermark" value="1" lay-filter="IsWatermark" title="开启">
					</div>
				</div>
				<button type="button" class="btn btn-cyan btn-round text-white mr-2" style="float: right;" id="submitForm">提交</button>
			</form>
		</div>
	</section>




	<!-------------------------------------- JAVASCRIPT --------------------------------------->
<!--	工具栏模板：-->
	<script type="text/html" id="toolbarDemo">
		<div class="layui-btn-container">
			<button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
			<button class="layui-btn layui-btn-sm" lay-event="delete">删除</button>
		</div>
	</script>
	<script src="../vendor/jquery.min.js" type="text/javascript"></script>
    <script src="../vendor/popper.min.js" type="text/javascript"></script>
    <script src="../vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="../vendor/share.js" type="text/javascript"></script>
    <script src="../js/functions.js" type="text/javascript"></script>
    <!-- <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/js/bootstrap.bundle.js"></script> -->
    <script src="../vendor/bootstrap.bundle.js"></script>
    <script src="../assets/layui/layui.js" type="text/javascript"></script>
	<script src="../assets/layui/cascader/cascader.js" type="text/javascript"></script>
    <script src="../js/tool.js" type="text/javascript"></script>

    <!-- Animation -->
    <script src="../vendor/aos.js" type="text/javascript"></script>
<!--	<script src="../assets/layui/layui_exts/selectInput.js"></script>-->
	<script type="text/javascript">
		// 获取URL中的查询参数部分
		const queryString = window.location.search;
		// 解析查询参数字符串，将其转换为对象
		const urlParams = new URLSearchParams(queryString);
		// 获取id参数的值
		const id = urlParams.get('id');
		//定义layui.form
		const form = layui.form;
		// 数据信息
		let productInfo = {};
		//选项切换
		let generationMode = 2;
		//设置的默认值
		let operateValue = 0;
		// 数据信息
		if (id) {
		    //获取数据产品详情
			console.log(window.parent.Http)
		    $.ajax({
		        timeout: 30000,
		        url: window.parent.Http + "/dataProduct/" + id,
		        type: 'GET',
		        headers: {
		            'Authorization': "Bearer " + sessionStorage.getItem('Token')
		        },
		        success: function (res) {
		            if (res.code === 200) {
		                productInfo = res.data;
		            }
		        }
		    })
		}

		// 切换生成方式
		form.on('select(generationMode)', function (data) {
			generationMode = Number(data.value);
			toggleFormItems(); // 切换表单项显示隐藏
		});

		// 监听表单项单选按钮选择
		form.on('radio(SharedManage)', function (data) {
			operateValue = data.value;
		});
		form.on('radio(StorageLocation)', function (data) {
			operateValue = data.value;
		});
		form.on('radio(IsAuthorization)', function (data) {
			operateValue = data.value;
		});
		form.on('radio(IsWatermark)', function (data) {
			operateValue = data.value;
		});
		// 请求后端接口
		function requestAjax() {
			let params = {
				dataType: 1, // 治理前数据类型
				ids: Array.isArray(id) ? id : [id], // 确保 ids 是一个数组
				operateType: generationMode, // 操作类型
				operateValue: operateValue // 具体操作值
			};

			$.ajax({
				timeout: 30000,
				url: window.Http + "/property/operate",
				type: 'POST',
				headers: {
					'Authorization': "Bearer " + sessionStorage.getItem('Token')
				},
				data: JSON.stringify(params),
				contentType: "application/json",
				success: function (res) {
					if (res.code === 200) {
						layer.msg("操作成功");
						setTimeout(function () {
							let index = parent.layer.getFrameIndex(window.name);
							parent.layer.close(index);
						}, 1000);
					} else if (res.msg) {
						layer.msg(res.msg);
					} else {
						layer.msg("操作失败");
					}
				},
				error: function () {
					layer.msg("操作失败，请稍后再试");
				}
			});
		}

		// 根据操作类型切换表单项显示隐藏
		function toggleFormItems() {
			$('.layui-form-item').addClass('hide'); // 隐藏所有表单项
			switch (generationMode) {
				case 1:
					$('.SharedManage').removeClass('hide'); // 显示共享管理
					break;
				case 2:
					$('.StorageLocation').removeClass('hide'); // 显示存储位置
					break;
				case 3:
					$('.IsAuthorization').removeClass('hide'); // 显示是否授权
					break;
				case 4:
					$('.IsWatermark').removeClass('hide'); // 显示是否添加水印
					break;
				default:
					break;
			}
		}

		// 提交按钮
		$('#submitForm').click(function (e) {
			e.preventDefault();
			requestAjax(); // 执行提交操作
		});
	</script>

</body>

</html>
